昨天我們介紹了Xcode的基本介面，以及專案設定與建置組態。

今天要來開始介紹SwiftUI

什麼是 SwiftUI？

SwiftUI 是 Apple 在 2019 年推出的 UI 框架，用來在 iOS、iPadOS、macOS、watchOS 和 tvOS 上建立使用者介面。

它最大的特色是 宣告式 (Declarative) 語法，讓你只需要描述「UI 長什麼樣子」和「狀態如何改變」，而不用手動管理 UI 的更新。

SwiftUI 的特點

1. 宣告式語法

   • 傳統 UIKit：要手動建立 View、控制 Frame、處理更新。
   • SwiftUI：只要描述「UI 長什麼樣子」，系統會自動隨狀態更新。

   Text("Hello, World!")
       .font(.title)
       .foregroundColor(.blue)
   

2. 跨平台

   • 一套程式碼，可以跑在 iPhone、iPad、Mac、Apple Watch、Apple TV 上。
   • Apple 在設計時就強調「一次開發、多端適用」。

3. 與 Swift 語言深度整合

   • 使用 Struct 來定義 UI 元件。
   • 搭配 @State、@Binding、@ObservedObject、@EnvironmentObject 等屬性包裝器管理狀態。

4. 即時預覽 (Preview)

   • Xcode 提供 Canvas 預覽，改程式碼就能即時看到畫面變化，減少反覆執行模擬器的時間。

宣告式 vs. 命令式 UI

• 命令式 (Imperative)：需要明確指定要操作的 UI 元件，並在事件發生時逐步改變其狀態。
• 宣告式 (Declarative)：將 UI 與狀態事先綁定，當狀態改變時，畫面會自動更新，不需手動操作。

基本架構

一個 SwiftUI App 的基本結構：

import SwiftUI

@main
struct MyFirstApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView() // 主畫面
        }
    }
}

struct ContentView: View {
    var body: some View {
        VStack {
            Text("Hello, SwiftUI!")
                .font(.largeTitle)
                .padding()

            Button("點我") {
                print("按鈕被點擊")
            }
        }
    }
}

#Preview {
    ContentView()
}

優點與限制

優點：

• 語法簡潔、開發效率高
• 跨平台支援
• 與 Swift 深度整合
• 即時預覽，大幅減少 Debug 時間

限制：

• 支援版本限制：iOS 13 以上才支援
• 一些複雜的 UI 或舊專案仍需要搭配 UIKit
• API 還在持續演進，會有版本差異

今日小結

今天我們認識了SwiftUI，了解它的特色、基礎架構，以及使用上的優缺點。

明天開始，我們會進一步介紹 SwiftUI 中的常見元件，一步一步建立出更完整的介面。